<template>
    <div class="total">
        <i class="iconfont icon-gouxuan"></i>
        <span>全选</span>
        <span>合计:</span>    
        <span>￥131167.00</span>   
        <div class="jiesuan">结算(5)</div> 
        <div class="top" @click="top()">
            <i class="iconfont icon-fanhuidingbu"></i>
        </div>
    </div>    
</template>

<script>
export default {
    methods:{
        top(){
            location.href="#";
        }
    }
}
</script>

<style scoped lang="scss">
.total{
    display: flex;
    align-items: center;
    >i{
        font-size: 16px;
        padding: 0 5px;
        color: orangered;
    }
    span{
        &:nth-of-type(2){
            margin-left: 65px;
        }
        &:nth-of-type(3){
            margin-left: 5px;
            color: orangered;
        }
    }
    .jiesuan{
        width: 100px;
        text-align: center;
        padding: 5px 0;
        color: white;
        background-color: orangered;
        margin-left: 35px;
        border-radius: 17px;
    }
    .top{
        position: fixed;
        bottom: 135px;
        right: 38%;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
        border-radius: 50%;
        background-color: white;
        border: 1px solid gainsboro;
    }
}
</style>